<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html lang="zh-cn">
<head>
<%@ include file="/Views/Common/header.jsp"%>
<!-- 页面特殊加载的js -->
<script type="text/javascript"
	src="${ctx}/Resource/js/grid.locale-cn.js"></script>
<script type="text/javascript"
	src="${ctx}/Resource/js/jquery.jqGrid.src.js"></script>
<script type="text/javascript"
	src="${ctx}/Resource/js/jquery.jqGrid.min.js"></script>
</head>
<body>
	<%@ include file="/Views/Common/top.jsp"%>
	<div class="container-fluid">
		<div class="row">
			<%@ include file="/Views/Common/navbar.jsp"%>
			<div class="col-sm-9 col-sm-offset-3 col-md-10 col-md-offset-2 main">
				<h4 class="page-header">
					<i class="glyphicon glyphicon-home" style="padding: 10px"></i>执行计划
					<div class="right" style="padding: 0px 16px 0px 16px">
						<button type="button"
							onclick="javascript:window.location.href='#'"
							class="btn btn-default">帮助</button>
						<button type="button"
							onclick="javascript:window.location.href='#'"
							class="btn btn-default">终止开发</button>
						<button type="button"
							onclick="javascript:window.location.href='sales_list'"
							class="btn btn-default">返回</button>
						<button type="button"
							onclick="javascript:window.location.href='sales_makePlan'"
							class="btn btn-default">制定计划</button>
						<button type="button"
							onclick="javascript:window.location.href='#'"
							class="btn btn-info">开发成功</button>
					</div>
					<div style="clear: both"></div>
				</h4>

				<div class="form-group">
					<div class="form-horizontal" role="form">
						<div class="form-group">
							<label class="col-sm-1 control-label">编号</label>
							<div class="col-sm-6">
								<input type="text" class="form-control " readonly> <span
									class="help-block"></span>
							</div>
						</div>
						<div class="form-group">
							<label class="col-sm-1 control-label">机会来源</label>
							<div class="col-sm-6">
								<input type="text" class="form-control " readonly> <span
									class="help-block"></span>
							</div>
						</div>
						<div class="form-group">
							<label class="col-sm-1 control-label">客户名称</label>
							<div class="col-sm-6">
								<input type="text" class="form-control required" readonly>
								<span class="help-block"></span>
							</div>
						</div>
						<div class="form-group">
							<label class="col-sm-1 control-label">成功机率</label>
							<div class="col-sm-6">
								<input type="text" class="form-control required" readonly>
								<span class="help-block"></span>
							</div>
						</div>
						<div class="form-group">
							<label class="col-sm-1 control-label">概要</label>
							<div class="col-sm-6">
								<input type="text" class="form-control required" readonly>
								<span class="help-block"></span>
							</div>
						</div>
						<div class="form-group">
							<label class="col-sm-1 control-label">联系人</label>
							<div class="col-sm-6">
								<input type="text" class="form-control " readonly> <span
									class="help-block"></span>
							</div>
						</div>
						<div class="form-group">
							<label class="col-sm-1 control-label">联系人电话</label>
							<div class="col-sm-6">
								<input type="text" class="form-control " readonly> <span
									class="help-block"></span>
							</div>
						</div>
						<div class="form-group">
							<label class="col-sm-1 control-label">机会描述</label>
							<div class="col-sm-6">
								<textarea class="form-control required" rows="3" readonly></textarea>
								<span class="help-block"></span>
							</div>
						</div>
						<div class="form-group">
							<label class="col-sm-1 control-label">创建人</label>
							<div class="col-sm-6">
								<input type="text" class="form-control required" readonly>
								<span class="help-block"></span>
							</div>
						</div>
						<div class="form-group">
							<label class="col-sm-1 control-label">创建时间</label>
							<div class="col-sm-6">
								<input type="text" class="form-control required" readonly>
								<span class="help-block"></span>
							</div>
						</div>
						<div class="form-group">
							<label class="col-sm-1 control-label">指派给</label>
							<div class="col-sm-6">
								<select class="form-control required" disabled>
									<option>请选择</option>
									<option>小李</option>
									<option>小王</option>
								</select> <span class="help-block"></span>
							</div>
						</div>
						<div class="form-group">
							<label class="col-sm-1 control-label">指派时间</label>
							<div class="col-sm-6">
								<input type="text" class="form-control required" readonly>
								<span class="help-block"></span>
							</div>
						</div>
					</div>
					<div style="clear: both"></div>
					<table id="grid-table"></table>
					<div id="grid-pager"></div>
				</div>
			</div>
		</div>
	</div>
		<script type="text/javascript">
		var grid_data = [ {
			id : "1",
			sdate : "2014/07/15",
			name : "采购笔记本电脑意向",
			state:"成功"
		},{
			id : "2",
			sdate : "2014/07/15",
			name : "采购笔记本电脑意向",
			state:"成功"
		},{
			id : "3",
			sdate : "2014/07/15",
			name : "采购笔记本电脑意向",
			state:"成功"
		}];

		jQuery(function($) {
			var grid_selector = "#grid-table";
			var pager_selector = "#grid-pager";

			jQuery(grid_selector).jqGrid(
					{
						//direction: "rtl",

						data : grid_data,
						datatype : "local",
						colNames : eval("(${colName})"),
						colModel : eval("(${colModel})"),

						viewrecords : true,
						rowNum : 10,
						rowList : [ 10, 20, 30 ],
						pager : pager_selector,
						altRows : true,
						multiselect : true,
						multiboxonly : true,

						loadComplete : function() {
							setTimeout(function() {
								doResize();
								//统一三个部分的宽度
								$(".ui-jqgrid-htable").attr("style",$(pager_selector).attr("style"));
								$(grid_selector).attr("style",$(pager_selector).attr("style"));
							}, 0);
							var ids = jQuery(grid_selector).jqGrid('getDataIDs');
							for ( var i = 0; i < ids.length; i++) {
								var cl = ids[i];
								update = "<div class='input-group'><input type='text' class='form-control required' value="+$(grid_selector).jqGrid("getRowData", cl).state+">"
								+"<span class='input-group-btn'><button class='btn btn-default' type='button'>保存</button></span></div>";
								jQuery(grid_selector).jqGrid('setRowData',
										ids[i], {
											state : update
										});
							}
						},
						shrinkToFit : true,
						autowidth : true,
						grouping : false,
						groupingView : {
							groupField : [ 'name' ],
							groupColumnShow : [ true ],
							groupText : [ '<b>{0}共有{1}条记录</b>' ],
							groupOrder : [ 'desc' ]
						},
					});
			//navButtons
			jQuery(grid_selector).jqGrid('navGrid', pager_selector, { //navbar options
				edit : false,
				add : false,
				del : false,
				search : false,
				refresh : false,
				view : false,
			})
		});
	</script>
</body>
</html>
